<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      .lfjka {
        visibility: hidden;
        height: 0;
        overflow: hidden;
      }
    </style>
  </head>
  <body>
    <div class="lfjka">
      <!-- <iframe
        id="iframeId"
        src="http://127.0.0.1:5501/web3.html"
        frameborder="0"
      ></iframe> -->
    </div>
    <script>
      console.log("web1");
      const child = window.open("http://127.0.0.1:5501/web3.html", "__blank");
      // const child = document.querySelector("#iframeId").contentWindow;
      const bc = new BroadcastChannel("wtc");
      window.addEventListener("message", (e) => {
        if (e.source !== window) console.log(e, "web1 listen message");
      });
      setTimeout(() => {
        child.postMessage("message from web1 1s", "http://127.0.0.1:5501");
      }, 1000);
      setTimeout(() => {
        child.postMessage("message from web1 2s", "http://127.0.0.1:5501");
      }, 2000);

      setTimeout(() => {
        bc.postMessage(
          { message: "bc send message from web1" },
          "http://127.0.0.1:5501/web3.html",
        );
      }, 3000);
      bc.onmessage = (e) => {
        console.log(e);
        console.log("web1 bc 接受wtc 信息");
      };
    </script>
  </body>
</html>
